<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="css/overStyle.css">
    <link rel="stylesheet" href="css/sellerList.css">
    <link href="//netdna.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
</head>
<body>
    <div class="top">
        商家列表
    </div>
    <div id="app" class="container">
        <div v-for="seller in sellerList">
            <a :href="seller.href" class="seller-list">
                <div class="image">
                    <img :src="seller.icon" alt="">
                    <div class="num" v-if="seller.num > 0">{{seller.num}}</div>
                </div>
                <div class="text">
                    <div class="sellerName"><b>{{seller.sellerName}}</b></div>
                    <div class="requirement">&yen;{{seller.upToSend}}起送 | &yen;{{seller.sendPrice}}配送</div>
                    <div class="food">{{seller.food}}</div>
                </div>
            </a>
        </div>
    </div>
    <div class="bottom">
        <div>
            <i class="fa fa-home"></i><br>首页
        </div>
        <div>
            <i class="fa fa-compass"></i><br>发现
        </div>
        <div>
            <i class="fa fa-file-text-o"></i><br>订单
        </div>
        <div>
            <i class="fa fa-user-o"></i><br>我的
        </div>
    </div>
    <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
    <script src="js/sellerList.js"></script>
</body>
</html>